<!-- 信息申诉 -->
<template>
	<zh-app style="font-family: '阿里巴巴普惠体'">
		<!-- 导航栏 -->
		<zh-navbar title="信息申诉" color="#85a5ff" linear="right"  />
		<!-- 表单 -->
		<view v-if="!data.showSuccess&&!data.showHas" class="container shadow">
			<zh-form @submit="submit" v-model="data.form" inputAlign="right" :label-width="180" :margin="[0, 24]" :padding="[10,0]">
				<zh-form-select field="type" :disabled="data.typeDisabled" :rules="[{required:true,message:'请选择申诉类型'}]" placeholder="请选择申诉类型" v-model="data.form.type" :options="data.dictData.COMPLAINTSTYPE" label="申诉类型" required showClear :transprent="true"></zh-form-select>
				<zh-form-input field="complainantName" :rules="[{required:true,message:'申诉人姓名不能为空'}]" v-model="data.form.complainantName" label="申诉人姓名" placeholder="请填写申诉人姓名" required showClear :transprent="true"></zh-form-input>
				<zh-form-input field="complainantPhone" :rules="[{required:true,message:'申诉人手机不能为空'}]" v-model="data.form.complainantPhone" label="手机号码" placeholder="请填写申诉人手机号码" required showClear :transprent="true"></zh-form-input>
				<zh-form-input field="content"  layout="vertical" :rules="[{required:true,message:'申诉内容不能为空'}]" inputAlign="left" type="textarea" :height="200" placeholder="请填写申诉内容" v-model="data.form.content" label="申诉内容" required showClear :transprent="true"></zh-form-input>
				<zh-form-upload 
					field="fileInfo" 
					v-model="data.form.fileInfo" 
					label="材料上传(可选)" 
					desc="若有相关佐证材料可选择上传" 
					:fileType="['image']" 
					:rows="3" 
					:width="620"
				></zh-form-upload>
							
				<zh-form-item :border="false">
					<view class="flex flex-row">
						<view class="flex-1 mr-32" style="margin: 0 auto">
							<zh-button :disabled="data.btnDisabled" :loading="data.btnDisabled" form-type="submit" label="确认提交" block></zh-button>
						</view>
					</view>
				</zh-form-item>
			</zh-form>
		</view>
		<zh-sheet  v-if="data.showSuccess||data.showHas">
			<zh-result  v-if="data.showSuccess"  color="green" status="success" title="提交成功!" subTitle="申诉提交成功!可前往我的申诉查看申诉结果" :showBtn="true" btnText="前往我的申诉" @click="gotoMyAppeal"></zh-result>
			<zh-result  v-if="data.showHas"  color="yellow" status="warning" title="重复提交提示" subTitle="您已提交申诉，请耐心等待管理员审核!可前往我的申诉查看申诉结果" :showBtn="true" btnText="前往我的申诉" @click="gotoMyAppeal"></zh-result>
		</zh-sheet>
	</zh-app>
</template>
<script lang="ts" setup>
	import {ref, reactive} from "vue";
	import { onLoad } from "@dcloudio/uni-app";
	import { user } from '@/store';
	// ------------------接收传入参数(组件)-------------------

	// ------------------钩子函数----------------------------
	// 初始化
	onLoad((options:any) => {
		if(options.type){
			data.form.type=options.type
			data.typeDisabled=true
		}else{
			data.typeDisabled=false
		}
		if(options.id){
			data.form.otherId=options.id
		}
		getDictData()
	})

	// ------------------变量区------------------------------
	const list = ref([])
	// 主数据
	const data = reactive({
		dictData:{} as any,
		typeDisabled:false,
		btnDisabled:false,
		showSuccess:false,
		showHas:false,
		// 表单
		form: {
			complainantName: user.fullName,
			complainantPhone: user.userInfo?.cellphone,
			content: '',
			otherId: '',
			personId: '',
			show_complainantName: '',
			show_complainantPhone: '',
			type: '',
			fileInfo: ''
		},
	})

	// ------------------方法区------------------------------
	// 提交
	const submit = (e:any) => {
		if(e.validate){
			data.btnDisabled=true
			$api.common.send.post("eduComplaint0004", data.form).then((res: any) => {
			  //保存成功后提示
			  data.showSuccess=true
			  data.btnDisabled=false
			}).catch((error:any)=>{
			  data.btnDisabled=false
			  if(error.code==1001){
				data.showHas=true
			  }
			})
			
		}
	}
	//获取数据字典
	const getDictData=()=>{
		const params = {
		  dictFields: 'COMPLAINTSTYPE',
		};
		$api.common.getBatchDict.post(params).then((res:any) => {
		  data.dictData = res.result;
		});
	}
	const gotoMyAppeal=()=>{
		$router.replace('/pages/edu/appeal/myAppeal', {});
	}

</script>
<style lang="scss" scoped>
	.container {
		 width: 630rpx;
		 padding: 30rpx;
		 margin: 30rpx;
		 border-radius: 0.5rem;
		 background-color: #FFFFFF;
	}
</style>
